import React from 'react'
import zfb from './zfb.png'
import axios from 'axios'
export default class App extends React.Component {

    state = {
        count: 100,
        roomList: []
    }


    componentDidMount() {
        axios.get('/api/RoomApi/live').then(res => {
            console.log(res.data.data);

            this.setState({
                roomList: res.data.data
            })
        })
    }

    render() {
        return (<div>
            <h1>你好世界！ {this.state.count} </h1>
            <button onClick={() => {
                this.setState({
                    count: this.state.count + 1
                })
            }} >加 1</button>
            <img style={{ width: '100px' }} src={zfb} alt="" />

            <ul>
                {
                    this.state.roomList.map((item) => {
                        return (<li key={item.room_id}>
                            <img src={item.room_src} alt="" />
                            <h5>{item.room_name}</h5>
                        </li>)
                    })
                }
            </ul>

        </div>)
    }
}